<template>
  <div class="header-block-wrapper">
    <div class="slogon-search">
      <div class="slogon">
        <span class="mr-4">快速选址</span>
        <span class="point mr-4"></span>
        <span>精准对接</span>
      </div>
    </div>

    <SearchTabs />
  </div>
</template>

<script lang="ts">
import Vue from 'vue'
import SearchTabs from '@/components/index/SearchTabs'
export default Vue.extend({
  components: { SearchTabs },
  data() {
    return {}
  },
  mounted() {},
})
</script>
<style lang="scss" scoped>
.header-block-wrapper {
  background-image: url(@/assets/img/bannar.png);
  background-size: cover;
  background-repeat: no-repeat;
  height: 450px;

  .slogon-search {
    padding-top: 90px;
    margin-bottom: 90px;
  }

  .slogon {
    font-size: 50px;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;

    .point {
      display: inline-block;
      width: 10px;
      height: 10px;
      background-color: #fff;
      border-radius: 50%;
    }
  }
}
</style>
